﻿@charset "utf-8";
@import "font.css";
body { margin: 0; font-family:Arial, Helvetica, sans-serif; font-size: 14px; line-height: 24px; color: #808080; background-color: #fff; background-image: url(../images/shattered-gray.png); background-position: left top; background-repeat: repeat; background-attachment: scroll; }
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { padding: 0; margin: 0; font-family:"pt-sans-narrow"; }
fieldset, img { border: 0; }
address, caption, cite, code, dfn, em, th, var { font-weight: normal; font-style: normal; }
ol, ul { list-style: none; }
caption, th { text-align: left; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; font-size: 100%; }
q:before, q:after { content: ''; }
abbr, acronym { border: 0; }
:focus { outline: 0; }
ins { text-decoration: none; }
del { text-decoration: line-through; }
a { text-decoration: none; color: #4798dd; }
a:hover { text-decoration: none; }
a img { border: none; }
.l { float: left; }
.r { float: right; }
.c { clear: both; }
.m { margin: 0 auto; }
.o { overflow: hidden; }
.C:before, .C:after { content: "."; display: block; height: 0; visibility: hidden; }
.C:after { clear: both; }
.C { zoom: 1; }
.w1000 { margin: 0 auto; width: 1000px; }
.m10 { margin: 10px; }
.mt10 { margin-top: 10px; }
.mt20 { margin-top: 20px; }
.mb15 { margin-bottom: 15px; }
.mt5 { margin-top: 5px; }
.lh23 { line-height: 23px; }
/*--header--*/
#st-body-wrap { display: block; position: relative; z-index: 1; height: 100%; width: 100%; padding: 10px 0 60px 0; }
.st-site-wrap { display: block; width: 100%; margin: 0 auto; background: #fff; -webkit-box-shadow: 0px 3px 20px 0px rgba(0,0,0,0.1); box-shadow: 0px 3px 20px 0px rgba(0,0,0,0.1); }
.st-site-wrap { width: 1100px; margin: 0 auto; }
/*___st-toolbar____*/
#st-toolbar { font-size: 11px; line-height: 36px; color: #808080; height: 50px; padding: 14px; }
.custom { float: left; }
.custom p a { padding: 0 5px; color: #333; }
.pull-right { float: right; height: 38px; }
#mod-finder-searchform label.finder { display: none }
#mod-finder-searchform.form-search { padding: 0; margin: 0; position: relative; }
#mod-finder-searchform.form-search input { height: 36px; line-height: 36px; margin: 0; font-size: 11px; color: #999; border: 0; min-width: 170px; box-shadow: none; background-color: #fff; border: 1px solid #fff; border-bottom: 1px solid #e5e5e5; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease; padding: 0 10px; }
#mod-finder-searchform button { position: absolute; display: block; height: 30px; width: 30px; float: right; top: 0; right: 0; left: auto; background: none; border: none; }
#mod-finder-searchform button i.icon-search { background: url(../images/glyphicons-halflings.png) -48px 0 no-repeat; display: block; height: 14px; width: 14px; }
/*----header------*/
.f { z-index: 10000; position: relative; width: 1100px; background: #FFF; height: 140px; border-bottom: 1px solid #ebebeb; }
.header { padding: 5px 0; background:#fff; width:1100px;}
.logo { }
#st-menu { margin-top: 0px; }
#st-menu .nav.menu ul li { width: 200px; }
#st-menu .nav.menu, #st-menu .nav.menu ul { margin: 0; padding: 0; line-height: 1em }
#st-menu .nav.menu:before, #st-menu .nav.menu:after { content: ""; display: table }
#st-menu .nav.menu:after { clear: both }
#st-menu .nav.menu { zoom: 1 }
#st-menu .nav.menu li { margin: 0; padding: 0; position: relative; letter-spacing: 0; text-decoration: none }
#st-menu .nav.menu li span.image-title { margin-left: 7px }
#st-menu .nav.menu { text-align: center; width: 100% }
#st-menu .nav.menu>li { float: left; padding: 0; cursor: pointer; font-size: 12px; margin: 0 1px 0 0; text-align: center; display: inline-block; font-weight: 400; border-left: 1px solid #f5f5f5; -webkit-transition: all .2s; -moz-transition: all .2s; transition: all .2s }
#st-menu .nav.menu>li:first-child { border: 0 }
#st-menu .nav.menu > li > a, #st-menu .nav.menu > li span.separator { display: block; width: auto; float: none; padding: 0px 25px; line-height: 48px; height: 48px; color: #333; text-transform: uppercase }
#st-menu .nav.menu > li.parent > a, #st-menu .nav.menu>li.parent>span.separator { padding: 0 30px 0 25px }
#st-menu .nav.menu > li > a:hover, #st-menu .nav.menu > li.active > a, #st-menu .nav.menu > li.parent:hover > a, #st-menu .nav.menu > li.active.parent > a, #st-menu .nav.menu > li > span.separator:hover, #st-menu .nav.menu > li.active > span.separator, #st-menu .nav.menu > li.current.active > a:hover, #st-menu .nav.menu > li.alias-parent-active > a, #st-menu .nav.menu > li.parent:hover > span.separator, #st-menu .nav.menu>li.active.parent>span.separator { color: #fff; background-color: #1f1f1f; background-color: rgba(32,104,189,0.95) }
#st-menu .nav.menu>li.parent:before { content: ""; display: block; position: absolute; width: 0; height: 0; top: 50%; right: 15px; margin-top: -1px; border-top: 3px solid #cecece; border-right: 3px solid transparent; border-bottom: 3px solid transparent; border-left: 3px solid transparent; -webkit-transition: all .2s; -moz-transition: all .2s; transition: all .2s }
#st-menu .nav.menu > li.parent:hover:before, #st-menu .nav.menu>li.active.parent:before { border-top: 3px solid #fff }
#st-menu .nav.menu ul { display: block; visibility: hidden; position: absolute; top: 48px; margin: 0; padding: 0; left: 0; height: auto; z-index: 9999; opacity: 0; background-color: #2068bd; -webkit-transform-origin: 0 0; -moz-transform-origin: 0 0; transform-origin: 0 0; -webkit-transition: all 400ms ease; -moz-transition: all 400ms ease; transition: all 400ms ease; -webkit-transform: rotateX(-90deg); -moz-transform: rotateX(-90deg); transform: rotateX(-90deg); -webkit-backface-visibility: hidden; -webkit-box-shadow: 0px 3px 7px 0px rgba(0,0,0,0.2); box-shadow: 0px 3px 7px 0px rgba(0,0,0,0.2); }
#st-menu .nav.menu ul li { float: none; display: block; width: 235px; margin: 0; font-weight: normal; font-size: 12px; text-align: left }
#st-menu .nav.menu ul li:last-child { border: 0 }
#st-menu .nav.menu ul li a, #st-menu .nav.menu ul li span.separator { float: none; display: block; width: auto; height: auto; line-height: 48px; padding: 0 20px; cursor: pointer; color: #fff; text-transform: none; -webkit-box-shadow: inset 0px -1px 0px 0px rgba(255,255,255,.08); box-shadow: inset 0px -1px 0px 0px rgba(255,255,255,.08) }
#st-menu .nav.menu ul li a:hover, #st-menu .nav.menu ul li.active > a, #st-menu .nav.menu ul li.parent:hover > a, #st-menu .nav.menu ul li.active.parent > a, #st-menu .nav.menu ul li.alias-parent-active > a, #st-menu .nav.menu ul li span.separator:hover, #st-menu .nav.menu ul li.active > span.separator, #st-menu .nav.menu ul li.parent:hover > span.separator, #st-menu .nav.menu ul li.active.parent>span.separator { color: #fff; background-color: #296ebf; background-color: rgba(0,0,0,0.8) }
#st-menu .nav.menu ul li.parent:before { width: 0; height: 0; vertical-align: top; border-top: 3px solid transparent; border-right: 3px solid transparent; border-bottom: 3px solid transparent; border-left: 3px solid #fff; content: ""; display: block; position: absolute; top: 50%; margin-top: -3px; right: 20px; -webkit-transition: all .2s ease; -moz-transition: all .2s ease; transition: all .2s ease }
#st-menu .nav.menu ul li.parent:hover:before, #st-menu .nav.menu ul li.active.parent:before { border-left: 3px solid #fff }
#st-menu .nav.menu ul ul { visibility: hidden; top: 0; left: 100%; margin: 0 }
#st-menu .nav.menu li:hover > ul, #st-menu .nav.menu ul li:hover>ul { visibility: visible; opacity: 1; margin: 0; -webkit-transform-origin: 0 0; -moz-transform-origin: 0 0; transform-origin: 0 0; -webkit-transform: rotateX(0deg); -moz-transform: rotateX(0deg); transform: rotateX(0deg) }
#st-menu .nav.menu > li > a, #st-menu .nav.menu>li>span.separator { -webkit-transition: all 100ms linear; -moz-transition: all 100ms linear; transition: all 100ms linear }
/*----banner------*/
#banner { padding: 0; border-bottom:4px solid #f0f0f0;}
/* 本例子css */
#banner .slideBox{ width:1100px; height:400px; overflow:hidden; position:relative;    }
#banner .slideBox .hd{ height:20px; overflow:hidden; position:absolute; right:10px; bottom:10px; z-index:1; }
#banner .slideBox .hd ul{ overflow:hidden; zoom:1; float:left;  }
#banner .slideBox .hd ul li{ float:left; margin-right:5px;  width:20px; height:20px; line-height:20px; text-align:center; background:#fff; cursor:pointer;   }
#banner .slideBox .hd ul li.on{ background:rgba(32,104,189,0.95) ; color:#fff; }
#banner .slideBox .bd{ position:relative; height:100%; z-index:0;   }
#banner .slideBox .bd li{ zoom:1; vertical-align:middle; }
#banner .slideBox .bd img{ width:1100px; height:400px; display:block; border:none;  }

/* 下面是前/后按钮代码，如果不需要删除即可 */
#banner .slideBox .prev,
#banner .slideBox .next{ position:absolute; left:3%; top:50%; margin-top:-25px; display:block; width:32px; height:40px; background:url(../images/slider-arrow.png) -110px 5px no-repeat; filter:alpha(opacity=50);opacity:0.5;   }
#banner .slideBox .next{ left:auto; right:3%; background-position:8px 5px; }
#banner .slideBox .prev:hover,
#banner .slideBox .next:hover{ filter:alpha(opacity=100);opacity:1;  }
#banner .slideBox .prevStop{ display:none;  }
#banner .slideBox .nextStop{ display:none;  }
/*----<div id="mainbody" class="clearfix">-----*/
#mainbody { padding: 20px 0; }
.i_product { }
.i_product .item-image { width: 210px; float: left; margin-right: 53px; overflow: hidden; }
.i_product .item-image.mr0 { margin-right: 0; }
.i_product .item-image .item-image-wrap { overflow: hidden; }
.i_product .item-image .item-image-wrap a { overflow: hidden; position: relative; display: block; }
.i_product .item-image-wrap img { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease }
.i_product .item-image-wrap a:hover img { -webkit-transform: scale(1.15); -moz-transform: scale(1.15); -ms-transform: scale(1.15); -o-transform: scale(1.15); transform: scale(1.15) }
.i_product a.st-promo-more { display: block; margin-top: 12px; border-top: 1px solid #e5e5e5; color: #333; font-size: 13px; padding: 5PX 0; font-weight: bold; }
.i_product .item-image-backdrop { background: #06C; position: absolute; width: 100%; height: 100%; top: 0; left: 0; display: none; }
.item-image-wrap .item-image-backdrop:before { content: ""; z-index: 11; display: block; width: 25px; height: 1px; background-color: #fff; position: absolute; top: 50%; left: 50%; margin-left: -12px; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease; -webkit-transform: translateX(-150px); -moz-transform: translateX(-150px); transform: translateX(-150px) }
.item-image-wrap .item-image-backdrop:after { content: ""; z-index: 12; display: block; width: 1px; height: 25px; background-color: #fff; position: absolute; top: 50%; left: 50%; margin-top: -12px; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease; -webkit-transform: translateY(-150px); -moz-transform: translateY(-150px); transform: translateY(-150px) }
.item-image-wrap a:hover .item-image-backdrop:before { -webkit-transform: translateX(0px); -moz-transform: translateX(0px); transform: translateX(0px) }
.item-image-wrap a:hover .item-image-backdrop:after { -webkit-transform: translateY(0px); -moz-transform: translateY(0px); transform: translateY(0px) }
/*----st-newsflash----*/
.st-newsflash { background-color: #f0f0f0; font-size: 11px; margin-top: 15px; }
.module-title { padding: 12px 0; margin-bottom: 18px; border-bottom: 1px solid #eaeaea; float: left; font-weight: 600; }
.module-title h3 { font-weight: bold; }
.st-newsflash .flexslider { padding-right: 100px }
.st-newsflash .intro-text { padding: 18px; display: block; text-transform: uppercase; font-weight: bold; font-size: 12px }
.st-newsflash p { margin: 0 }
.st-newsflash .module-title { margin: 0; padding: 0; border: 0 }
.st-newsflash .module-title h3 { font-size: 12px; line-height: 40px; margin: 0 20px }
.flex-direction-nav.news a { width: 30px; height: 30px; background-image: url(../images/news-interface-highlight.png); background-repeat: no-repeat }
.flex-direction-nav.news .flex-next { background-position: 100% 0; right: 30px }
.flex-direction-nav.news .flex-next:hover { background-color: #333; background-position: 0 0 }
.flex-direction-nav.news .flex-prev { right: 62px; background-position: 0 100% }
.flex-direction-nav.news .flex-prev:hover { background-color: #333; background-position: 100% 100% }
.flexslider { margin: 0; position: relative; zoom: 1 }
.flex-viewport { max-height: 1000px; -webkit-transition: all 500ms ease-in-out; -moz-transition: all 500ms ease-in-out; -ms-transition: all 500ms ease-in-out; -o-transition: all 500ms ease-in-out; transition: all 500ms ease-in-out }
.loading .flex-viewport { max-height: 200px }
.flexslider .slides { zoom: 1 }
.flex-direction-nav { list-style-type: none; padding: 0; margin: 0; *height:0
}
.flex-direction-nav a { margin: -15px 0 0; display: block; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; opacity: 0.7 }
.flex-direction-nav li a { -webkit-transition: all 180ms ease-in-out; -moz-transition: all 180ms ease-in-out; -ms-transition: all 180ms ease-in-out; -o-transition: all 180ms ease-in-out; transition: all 180ms ease-in-out }
.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover { opacity: 1 }
.flex-direction-nav .flex-disabled { opacity: 0.4!important; filter: alpha(opacity=40); cursor: default }
.flex-slider-container { overflow: hidden; padding: 8px 0 }
.st-newsflash .flexslider { padding-right: 100px; }
.st-newsflash .intro-text { padding: 18px; display: block; text-transform: uppercase; font-weight: bold; font-size: 12px }
.seven-news-text { cursor: pointer; color: #666; }
.seven-news-text span { color: #4798dd }
/*----social-bar----*/
#social-bar { background-color: #e6e6e6; font-size: 11px; line-height: 60px }
#social-bar .w1000 { border-bottom: 1px solid #d9d9d9; width: 1000px; margin: 0 auto; }
#social-bar .pull-left { float: left; }
#social-bar p { margin: 0 }
#social-bar a:hover { text-decoration: underline }
#social-bar ul { margin: 0 }
#social-bar ul.nav li { float: left; line-height: 36px; padding: 12px }
#social-bar ul.nav li:first-child { padding-left: 0 }
#social-bar ul.nav li a { color: #696969 }
ul.social-icons { display: block; list-style-type: none; padding: 0 }
ul.social-icons li { padding: 0; margin: 0; float: left; margin: 15px 0; display: inline-block ; padding:0 5px;}
ul.social-icons li a { background-image: url(../images/social-icons.png); background-repeat: no-repeat; float: left; display: block; width: 30px; height: 30px; opacity: 0.75; filter: alpha(opacity=45); -webkit-transition: all 180ms ease-in-out; -moz-transition: all 180ms ease-in-out; transition: all 180ms ease-in-out; }
ul.social-icons li a:hover{ background-color: #666; border-radius:5px;}
ul.social-icons li.icon_twitter a { background-position: 0 0 }
ul.social-icons li.icon_facebook a { background-position: -30px -0 }
ul.social-icons li.icon_dribbble a { background-position: -60px 0 }
ul.social-icons li.icon_skype a { background-position: -90px 0 }
ul.social-icons li.icon_googleplus a { background-position: -120px 0 }
ul.social-icons li.icon_flickr a { background-position: -150px 0 }
ul.social-icons li.icon_youtube a { background-position: -180px 0 }
ul.social-icons li.icon_vimeo a { background-position: -210px 0 }
ul.social-icons li.icon_in a { background-position: -240px 0 }
/*-----footer------*/
#footer { line-height: 30px; font-size: 11px; background-color: #e6e6e6; padding: 15px 0 40px 0; }
#footer p { padding: 0; margin: 0 }
#footer a:hover { text-decoration: underline }
#footer ul.nav li { float: left; line-height: 60px; padding: 0 12px }
#footer ul.nav li:first-child { padding-left: 0 }
#footer ul.nav li a { color: #696969 }
#footer ul.nav li a:hover { background: none; text-decoration: underline }
a#totop { width: 60px; height: 60px; line-height: 60px; text-align: center; color: #565656; font-size: 19px; display: block; background-color: transparent; border: 1px solid rgba(0,0,0,0.1); border-bottom: 0; -webkit-transition: background .2s, border .2s, color .2s; -moz-transition: background .2s, border .2s, color .2s; transition: background .2s, border .2s, color .2s; margin-top: -20px; }
/*---滑动新闻----*/
/* 本例子css */
.txtScroll-left { position: relative; overflow: hidden; }
.txtScroll-left .hd { overflow: hidden; height: 30px; padding: 0 10px; position: absolute; left: auto; right: 0; width: 80px; }
.txtScroll-left .hd .prev, .txtScroll-left .hd .next { display: block; width: 30px; height: 30px; background-image: url(../images/news-interface-highlight.png); background-repeat: no-repeat; float: right; margin-top: -5px; }
.txtScroll-left .hd .prev { background-position: 0 100%; }
.txtScroll-left .hd .next { background-position: 100% 0; }
.txtScroll-left .hd a.prev:hover { background-color: #333; background-position: 100% 100%; }
.txtScroll-left .hd a.next:hover { background-color: #333; background-position: 0 0; }
.txtScroll-left .hd ul { float: right; overflow: hidden; zoom: 1; margin-top: 10px; }
.txtScroll-left .hd ul li { float: left; width: 9px; height: 9px; overflow: hidden; margin-right: 5px; text-indent: -999px; cursor: pointer; background: url("../images/icoCircle.gif") 0 -9px no-repeat; }
.txtScroll-left .hd ul li.on { background-position: 0 0; }
.txtScroll-left .bd { padding: 0 4px; width: 630px; overflow: hidden; }
.txtScroll-left .bd ul { overflow: hidden; zoom: 1; }
.txtScroll-left .bd ul li { margin-right: 20px; float: left; height: 24px; line-height: 24px; text-align: left; _display: inline; width: 800px }
.txtScroll-left .bd ul li a { display: block; }
.txtScroll-left .bd ul li a span { color: #999; float: right }
/*----i_about----*/
.i_about { padding-top: 10px; }
.i_about .custom { width: 230px; padding: 10px 0; font-size: 12px }
.i_about .custom h3 { color: #202020; margin-top: 0; font-weight: 700; text-transform: uppercase; font-size: 18px; line-height: 36px; margin-bottom: 10px; }
.i_about .custom02 { padding-left: 32px; }
.i_about .custom03 { padding-left: 32px; padding-top: 30px; }
.i_about .custom04 { width: 210px; float: right; padding: 0px; margin-top: 10px }
/*----app-----*/
div.title h4 { margin-bottom: 10px }
/*info_banner*/
.info_banner { background: url(../Images/p_banner.jpg) center no-repeat; height: 200px; }
.b_55 { background: url(../Images/p_banner_news.jpg) center no-repeat; }
.breadcrumb { border-bottom: 1px solid #f0f0f0; }
#contentbg { padding-bottom: 25px; }
#left { float: left; width: 155px; }
#right { float: right; width: 819px; }
#right .m10 { margin: 0; }
#right .subject_bg { font-size: 30px; line-height: 48px; margin-bottom: 24px; border-bottom: 1px solid #eee; }
#right .subject_bg .subject_title { color: #202020; margin-top: 0; font-weight: 700; text-transform: uppercase; }
#right .subject_bg .subject_title a { color: #202020; }
#left .module-title { paddng: 12px 0; margin-bottom: 24px; border-bottom: 1px solid #eaeaea; }
#left .module-title h3 { font-size: 14px; font-weight: 300; margin: 0; padding: 0; line-height: 24px; text-transform: uppercase; font-family:"pt-sans-narrow" }
#left .module-title h3 span { font-weight: bold; font-weight: 600; }
#dd_top .subject_bg { font-size: 30px; line-height: 48px; margin-bottom: 24px; border-bottom: 1px solid #eee; }
#dd_top .m10 { margin: 0; line-height: 24px; }
#dd_top .subject_bg .subject_title { color: #202020; margin-top: 0; font-weight: 700; text-transform: uppercase; }
#dd_top .subject_bg .subject_title a { color: #202020; }
/*---contact---*/
.dd_map { padding: 0 10px; }
/*----panel----*/
.panel { margin-bottom: 10px; vertical-align: middle; }
.panel a.camera { line-height: 21px; padding-left: 10px; vertical-align: middle; font-size: 21px; }
.panel a.camera img { vertical-align: text-top; padding-top: 6px; }
.info_content { font-family: Arial, Helvetica, sans-serif; color: #666 }
.info_content p { margin-bottom: 5px; }
/*----#dd_bottom----*/
#dd_bottom { margin-top: 25px; }
.ke-zeroborder { text-align: left; color: #666; }
/*----app-----*/
div.title h4 { margin-bottom: 15px; font-size: 20px; }
div.app div { margin-bottom: 10px; }

/* qqshop focus */
#focus {width:210px; height:177px; overflow:hidden; position:relative;}
#focus ul {height:380px; position:absolute;}
#focus ul li {float:left; width:210px; height:177px; overflow:hidden; position:relative; background:#000;}
#focus ul li div {position:absolute; overflow:hidden;}
#focus .btnBg {position:absolute; width:210px; height:20px; left:0; bottom:0; }
#focus .btn {position:absolute; width:180px; height:10px; padding:5px 10px; right:0; bottom:0; text-align:right;}
#focus .btn span {display:inline-block; _display:inline; _zoom:1; width:25px; height:10px; _font-size:0; margin-left:5px; cursor:pointer; background:#fff;}
#focus .btn span.on {background:#fff;}
#focus .preNext {width:45px; height:100px; position:absolute; top:90px; cursor:pointer;}
#focus .pre {left:0;}
#focus .next {right:0; background-position:right top;}